 <style>
    * {
        margin: 0;
        padding: 0;
    }

    .banner {
        width: 100%;
        height: 10rem;
        overflow: hidden;
    }

    .banner > ul {
        width: 300%;
        height: 10rem;
        display: flex;
        list-style: none;
    }

    .banner > ul > li > img {
        width: 100%;
        height: 100%;
    }
    .div{
        width: 100%;
        display: flex;
        margin: 2rem auto;
        border-bottom: 1px solid gainsboro;
    }
    .div>div{
        display: flex;
        width: 50%;
        height: 6rem;
        margin-left: 3rem;
        font-size: 2rem;
        line-height: 5rem;
        text-align: center;
    }
    .div1{
        width:100%;
    }
    .div1>div{
        width: 100%;
        display: flex;
        font-size: 1.5rem;
        border-top: 1px solid #bcbcbc;
        padding: 1rem;
    }
    .div1>div>div:nth-child(1){
        width: 30%;
    }
    .div1>div>div:nth-child(1)>img{
        width: 100%;
        height: 100%;
    }
    .div1>div>div:nth-child(2){
        margin-left: 2rem;
    }
    .div2 {
        width: 100%;
        height: 15rem;
    }

    .div2 > ul {
        width: 100%;
        height: 10rem;
        display: flex;
        justify-content: space-around;
    }

    .div2 > ul > li {
        width: 33.3%;
        height: 10rem;
        font-size: 1.5rem;
    }

    .div2 > ul > li > img {
        width: 95%;
        height: 9rem;
    }
    .swiper-slide{
        width: 100%;
    }
    .swiper-slide>img{
        width:100%;
    }

</style>
    <div class="swiper-container">
        <div class="swiper-wrapper">
            <div class="swiper-slide" ng-repeat="item in obj3[0].one track by $index">
                <img ng-src="{{item}}" alt="" />
            </div>
        </div>
        <div class="swiper-pagination"></div>
    </div>
<!--</div>-->
<div class="div">
    <div ng-repeat="item in obj3[1].two track by $index">
        <div><img ng-src="{{item.img}}" alt=""></div>
        <p>{{item.con}}</p>
    </div>
</div>
<div class="div1">
    <p style="font-size: 2rem;margin: 1rem auto;">每天听一些好节目</p>
    <div ng-repeat="item in obj3[2].three track by $index ">
        <div><img ng-src="{{item.img}}" alt=""></div>
        <div>
            <p style="font-size: 1.6rem;">{{item.con1}}</p>
            <p style="margin-top: 1.5rem;color: #868686;">{{item.con2}}</p>
        </div>
    </div>
</div>
 <p style="font-size: 2rem;margin-bottom: 1rem;">电台个性推荐</p>
<div class="div2" ng-repeat="item in obj3[3].four track by $index">
    <ul>
        <li><img ng-src="{{item.img}}" alt="">
            <p>{{item.con}}</p></li>
        <li><img ng-src="{{item.img1}}" alt="">
            <p>{{item.con2}}</p></li>
        <li><img ng-src="{{item.img2}}" alt="">
            <p>{{item.con3}}</p></li>
    </ul>
</div>
<div class="div2" ng-repeat="item in obj3[4].five track by $index">
    <p style="font-size: 2rem;margin-bottom: 1rem;">{{item.con}}</p>
    <ul>
        <li><img ng-src="{{item.img}}" alt="">
            <p>{{item.con1}}</p></li>
        <li><img ng-src="{{item.img1}}" alt="">
            <p>{{item.con2}}</p></li>
        <li><img ng-src="{{item.img3}}" alt="">
            <p>{{item.con3}}</p></li>
    </ul>
</div>
<p style="font-size: 2rem;margin-bottom: 1rem;">热门分类</p>
<div class="div" ng-repeat="item in obj3[5].six track by $index">
    <div>
        <div><img ng-src="{{item.img}}" alt="" style="width: 4rem;height: 4rem;"></div>
        <p>{{item.con}}</p>
    </div>
    <div>
        <div><img ng-src="{{item.img1}}" alt="" style="width: 4rem;height: 4rem;"></div>
        <p>{{item.con2}}</p>
    </div>
</div>
<p style="font-size: 2rem;margin-bottom: 1rem;">更多分类</p>
<div class="div" ng-repeat="item in obj3[6].seven track by $index">
    <div>
        <div><img ng-src="{{item.img}}" alt="" style="width: 4rem;height: 4rem;"></div>
        <p>{{item.con}}</p>
    </div>
    <div>
        <div><img ng-src="{{item.img1}}" alt="" style="width: 4rem;height: 4rem;"></div>
        <p>{{item.con1}}</p>
    </div>
</div>